<div id="ecard_frame">
	<canvas id="c" width="960" height="640">
		Sorry, your web browser does not support Canvas content.
	</canvas>
    <div class="center" style="position:relative;">
	<a href="<?php echo site_url("personalize");?>" id="btn_personalize" class="link_btn">Personalize</a>
</div>
</div>

<script>
var base_url = "<?php echo base_url();?>";
var canvas_width = 960;
var canvas_height = 640;

var canvas = new fabric.StaticCanvas('c');
canvas.setBackgroundImage(base_url + 'content/images/Sunset.jpg');

fabric.Image.fromURL(base_url + 'content/images/blue.png', function(img) {	
	canvas.add(img.set({ left: 160, top: 240, angle: 0 }));
});

fabric.Image.fromURL(base_url + 'content/images/red.png', function(img) {	
	canvas.add(img.set({ left: 480, top: 240, angle: 0 }));
});

fabric.Image.fromURL(base_url + 'content/images/green.png', function(img) {	
	canvas.add(img.set({ left: 800, top: 240, angle: 0 }));
});

</script>